<template>
    <view v-model="goods">
        <view class="goods-container" v-if="goods && goods.goods_id">
            <!-- 轮播图 -->
            <view>
                <goods-swiper :list="gallery_list" :goods-video="goods_video" :autoplay="false" :circular="false" height="750" mode="number" indicator-pos="bottomRight" @click="handlePreviewImage"></goods-swiper>
            </view>
            <!-- 拼团 -->
            <goods-assemble :assemble="assemble" :is_assemble="is_assemble" v-if="is_assemble"  @count-end="onRefresh()" ></goods-assemble>
            <!-- 团购、限时抢购 -->
            <goods-groupbuy-seckill :promotions="promotions" :selectedSku="selectedSku" @count-ends="handleCountEnd" v-else/>
            <!-- 积分兑换 -->
            <goods-exchange :promotions="promotions" />

            <!-- 商品基本信息 -->
            <view class="goods-base-view">
                <view class="base-price-view u-p-b-20">
                    <view class="u-flex" style="align-items: baseline;">
                        <block v-if="!hiddenPrice && !is_assemble">
                            <custom-price v-if="selectedSku && selectedSku.price" :price="selectedSku.price" :textColor="'#ff5000'" :fontWeight="600" :size="50"></custom-price>
                            <custom-price v-else :price="goods.price" :textColor="'#ff5000'" :fontWeight="600" :size="50"></custom-price>
                        </block>
                    </view>
                    <view class="u-flex">
                        <view class="u-text-center u-m-r-30" @click="handleShare">
                            <u-icon name="fenxiang1" custom-prefix="custom-icon" size="40"></u-icon>
                            <view class="u-font-10">
                                <text class="collection-text">分享</text>
                            </view>
                        </view>
                        <view class="u-text-center" @click="handleCollect">
                            <u-icon :class="collected ? 'collection-icon-selected' : ''" :name="collected ? 'heart-fill' : 'heart'" size="40"></u-icon>
                            <view class="u-font-10">
                                <text class="collection-text"> {{ collected ? '已收藏' : '收藏'}}</text>
                            </view>
                        </view>
                    </view>
                </view>
                <view class="u-line-2">
                    <text class="self u-m-r-10" v-if="self_operated">自营</text>
                    <text class="goods-title">{{goods.goods_name}}</text>
                </view>
            </view>
            <!-- 优惠券和促销 -->
            <view class="discounts-view">
                <!-- 优惠券 -->
                <goods-coupons :goodsId="goods.goods_id" :selectedSku="selectedSku" v-if="!is_assemble"/>
                <u-line color="#f3f4f6" />
                <!-- 促销 -->
                <goods-promotions :promotions="promotions" :selectedSku="selectedSku"/>
            </view>

            <!-- 规格、参数 -->
            <view v-if="goods && goods.goods_id">
                <goods-specs
                     :goods="goods"
                     :promotions="promotions"
                     :show="skuPopupShow"
                     :sku_id="sku_id"
                     :assemble="assemble"
                     @sku-changed="handleGetAssembleDetail"
                     @num-changed="handleBuyNum"
                     @add-cart="handleAddToCart"
                     @buy-now="handleBuyNow"
                     @close="handleskuPopup"
                 />
            </view>

            <!-- 拼团订单 -->
           <goods-assemble-order :showPopup="false" :assembleOrder="assembleOrder" :assembleOrderAll="assembleOrderAll" @to-assemble-buy-now="toAssembleBuyNow" v-if="is_assemble && assembleOrder.length > 0"></goods-assemble-order>
            <!-- 评价 -->
           <goods-comments :goodsId="goods.goods_id" :grade="goods.grade" />

            <!-- 问答 -->
            <goods-ask :goodsId="goods.goods_id" />

            <!-- 店铺 -->
            <view v-if="goods.seller_id">
                <goods-seller :sellerId="goods.seller_id" ref="seller" @self-change="selfChange" />
            </view>

            <!-- 商品详情 -->
            <goods-params :mobile_intro="goods.mobile_intro" :paramList="goods.param_list" />

            <!-- 安全区 -->
            <view class="safe-view">
                <u-divider>到底了哦~</u-divider>
            </view>
        </view>

        <view v-if="goods.market_enable === 0" class="market-enable"> 商品已下架啦~ </view>
        <view v-if="goods.is_auth === 0" class="market-enable">此商品正在审核中，先看看其它商品吧。</view>

        <!-- 加入购物车 -->
        <view class="navigation">
            <view class="left-view">
                <!-- #ifdef MP-WEIXIN -->
                <view v-if="is_IM" class="item act" @click="handleChat">
                  <u-icon name="xiaoxi" custom-prefix="custom-icon" :size="40"></u-icon>
                  <view class="text u-line-1">客服</view>
                </view>
                <button v-else open-type="contact">
                    <u-icon name="xiaoxi" custom-prefix="custom-icon" :size="40"></u-icon>
                    <view class="text u-line-1">客服</view>
                </button>
                <!-- #endif -->
                <!-- #ifdef APP-PLUS || H5 -->
                <view class="item act" @click="handleChat">
                    <u-icon name="xiaoxi" custom-prefix="custom-icon" :size="40"></u-icon>
                    <view class="text u-line-1">客服</view>
                </view>
                <!-- #endif -->
                <view class="item car" @click="handleCart">
                    <u-badge v-if="cartGoodsCount" class="car-num" :count="cartGoodsCount > 99 ? '99+' : cartGoodsCount" type="error" :absolute="true" :offset="[-16, -12]"></u-badge>
                    <u-icon name="gouwuche4" custom-prefix="custom-icon" :size="40"></u-icon>
                    <view class="text u-line-1">购物车</view>
                </view>
            </view>
            <view class="right-view u-flex-1 u-flex" v-if="is_assemble">
                <view class="alone-buy btn u-line-1 u-flex-1" @click="handleBuyNow()">
                    <text>{{ assemble.origin_price | unitPrice('￥') }}</text>
                    <text>单独购买</text>
                </view>
                <view class="assemble-buy btn u-line-1 u-flex-1" @click="handleAssembleBuyNow()">
                    <text>{{ assemble.sales_price | unitPrice('￥') }}</text>
                    <text>{{ assemble.required_num }}人团</text>
                </view>
            </view>
            <view class="right-view u-flex-1 u-flex" v-else>
                <view v-if="buyNum === 0" class="inventory btn u-line-1 u-flex-1">暂无库存</view>
                <view v-if="buyNum !== 0" class="cart btn u-line-1 u-flex-1" :class="!is_buy?'disable':''" @click="handleAddToCart()">加入购物车</view>
                <view v-if="buyNum !== 0" class="buy btn u-line-1 u-flex-1" :class="!is_buy?'disable':''" @click="handleBuyNow()">立即购买</view>
            </view>
        </view>
        <!-- 分销 -->
        <goods-distribution
            ref="distribution"
            :show="disPopupShow"
            :goods_id="goods.goods_id"
            :goods_name="goods.goods_name"
            :goods_img="goods_img"
            :goods_price="goods.price"
            :promotions="promotions"
            :disParams="disParams"
            :minicode="minicode"
            @close="handleClose"
        ></goods-distribution>

        <!-- 直播 -->
        <view class="live-video u-flex" v-if="is_liveVideo && is_seller_liveVideo">
            <view class="u-flex" @click="handleLiveVideo">
                <u-icon name="zhibo" custom-prefix="custom-icon"></u-icon>
                <text style="margin:0 10rpx;">正在直播，点击查看</text>
                <u-icon name="arrow-right" ></u-icon>
            </view>
            <view @click="is_liveVideo = false">
                <u-icon class="u-m-l-20" name="close"></u-icon>
            </view>
        </view>
        <!-- 进入加载 -->
        <loading-view v-if="loading"></loading-view>
    </view>
</template>

<script>
    import * as API_Goods from '@/api/goods.js'
    import * as API_Trade from '@/api/trade.js'
    import * as API_Members from '@/api/members.js'
    import * as API_Common from '@/api/common.js'
    import * as API_Promotions from '@/api/promotions.js'
    import * as API_Distribution from '@/api/distribution.js'
    import * as API_Collection from '@/api/collection.js'
    import * as API_Live from '@/api/live.js'
    import Cache,{Keys} from '@/utils/cache.js'
    import { domain, liveVideo, im } from '@/config/config.js'
    import goodsGroupbuySeckill from './-goods/-goods-groupbuy-seckill.vue'
    import goodsExchange from './-goods/-goods-exchange.vue'
    import goodsCoupons from './-goods/-goods-coupons.vue'
    import goodsPromotions from './-goods/-goods-promotions.vue'
    import goodsSpecs from './-goods/-goods-specs.vue'
    import goodsComments from './-goods/-goods-comments.vue'
    import goodsAsk from './-goods/-goods-ask.vue'
    import goodsParams from './-goods/-goods-params.vue'
    import goodsDistribution from './-goods/-goods-distribution.vue'
    import goodsSeller from './-goods/-goods-seller.vue'
    import goodsAssemble from './-goods/-goods-assemble.vue'
    import goodsAssembleOrder from './-goods/-goods-assemble-order.vue'

    export default {
        data() {
            return {
                /** 商品信息相关 */
                goods_id: 298, //商品id
                goods: {}, //商品详情信息
                gallery_list: [], //商品轮播图片
                goods_video: '', //商品视频
                /** 规格相关 */
                selectedSku: {},  //已选SKU
                activity_id: '', //已选SKU参与的活动id
                promotion_type: '', //已选SKU参与的活动类型
                skuPopupShow: false, //规格弹窗
                sku_id: '', // 路由加载参数中携带的sku_id
                buyNum: 1, // 所选商品数量
                collected: false, //收藏
                /** 促销信息 */
                promotions: [],
                cartGoodsCount: 0 ,//购物车数量
                disPopupShow: false, // 展示分销弹框
                su: '', //分销参数
                from: '' ,//二维码分销参数
                // 是否是拼团 默认不是
                is_assemble: false,
                pintuan_id: '', //拼团id
                // 拼团信息
                assemble: {},
                // 待成团订单信息
                assembleOrder: [],
                assembleOrderAll: [],
                from_nav: '',
                is_liveVideo: false, //是否开启直播功能
                is_seller_liveVideo: false, // 是否显示直播入口
                room_id: '' ,// 直播id
                goods_img: '',
                loading: true,
                is_buy: true,
                self_operated: 0, //是否是自营商品
                is_IM: im, // 是否开启了IM
                disParams: '', //分销参数,
                minicode: '' //小程序码
            };
        },
        components: {
            goodsGroupbuySeckill,
            goodsExchange,
            goodsCoupons,
            goodsPromotions,
            goodsSpecs,
            goodsComments,
            goodsAsk,
            goodsParams,
            goodsDistribution,
            goodsSeller,
            goodsAssemble,
            goodsAssembleOrder
        },
        onLoad(options) {
            //解析获取到生成二维码时传入的 scene
            const scene = decodeURIComponent(options.scene)
            const sceneArr = scene.split("&")
            this.goods_id = options.goods_id || sceneArr[0] || ''
            this.sku_id = options.sku_id || ''
            this.pintuan_id = options.pintuan_id || ''
            this.from_nav = options.from_nav || ''
            this.su = options.su || ''
            this.from = sceneArr[1] || ''
            this.goodsDetail()
            // 如果存在sku_id 并且带有拼团标识
            if (options.sku_id && options.from_nav === 'assemble') {
              this.pinTuanDetail(options);
            }

            let pages = getCurrentPages() //获取加载页面
            let currentPage = pages[pages.length-1] //获取当前页面的对象
            let url = currentPage.route + '/' + options.goods_id //获取当前页面路径
            API_Common.recordView(url) //记录浏览量统计
        },
        onShow() {
            if (Cache.getItem(Keys.accessToken)) {
                this.getAllCount()
                this.getGenerateShortLink()
            }
        },
        computed: {
            //是否隐藏价格
            hiddenPrice() {
                const { promotions = prom ,selectedSku} = this
                if (!promotions || !promotions.length) return false

                for (let i in promotions) {
                    // 如果有团购，隐藏价格
                    if (promotions[i].promotion_type === 'GROUPBUY' && promotions[i].sku_id === selectedSku.sku_id) {
                        return true
                    }
                    // 如果有限时抢购，隐藏价格
                    if (promotions[i].promotion_type === 'SECKILL' && promotions[i].sku_id === selectedSku.sku_id) {
                        return true
                    }
                }
                // 如果有积分兑换，隐藏价格
                if (promotions.filter(item => item.exchange)[0]) {
                    return true
                }

                return false
            }
        },
        //小程序分享
        onShareAppMessage(res) {
            this.$refs.distribution.disShow = false
            let disParams
            if (Cache.getItem(Keys.accessToken)) {
                disParams = this.disParams
            } else {
                disParams = `?goods_id=${this.goods_id}`
            }
            return {
                title: this.goods.goods_name,
                imageUrl: this.goods.thumbnail,
                path: `/goods-module/goods${disParams}`
            }
        },
        methods: {
            //拼团详情
            async pinTuanDetail(options) {
               await  API_Promotions.getAssembleDetail(options.sku_id).then(res => {
                   this.is_assemble = true
                   this.assemble = res
               });
               await API_Promotions.getAssembleOrderList(options.goods_id, {sku_id: options.sku_id}).then(res => {
                   const orderList = res.map(key => {
                       return {
                         left_time: key.left_time,
                         offered_num: key.offered_num,
                         required_num: key.required_num,
                         face: key.participants.map(item => {
                           if (item.is_master === 1) {
                             return item.face
                           }
                         })[0],
                         order_id: key.order_id,
                         name: key.participants.map(item => {
                           if (item.is_master === 1) {
                             return item.name
                           }
                         })[0]
                       }
                    })
                    if(orderList && orderList.length){
                      for(let i=0,len=orderList.length;i<len;i+=2){
                        this.assembleOrder.push(orderList.slice(i,i+2))
                      }
                    }
                    this.assembleOrderAll = orderList
               });
            },
            //商品详情
            goodsDetail() {
                const that = this
                API_Goods.getGoods(this.goods_id).then(res => {
                    this.goods = res;
                    // #ifdef H5
                    API_Common.getBase64(res.thumbnail).then(base64 => {
                        this.goods_img =  'data:image/jpg;base64,' + base64
                    })
                    // #endif
                    //#ifndef H5
                    //商品图片转换为https
                    this.goods_img = res.thumbnail.replace(/http\:\/\//, 'https://')
                    //#endif
                    const img_list = [];
                    if (res.gallery_list) {
                        res.gallery_list.forEach(gallery => {
                            const img = {
                                image: gallery.small
                            }
                            img_list.push(img);
                        })
                    }
                    this.gallery_list = img_list;
                    this.goods_video = res.goods_video;
                    //移动端详情
                    if(res.mobile_intro) {
                        this.goods.mobile_intro = JSON.parse(this.goods.mobile_intro)
                    }
                    !this.is_assemble && this.getGoodsPromotions()
                    // 如果页面是被分享的 则调用分销参数回传API
                    this.su && API_Distribution.accessShortLink({ su: this.su })
                    // 如果页面是通过小程序码分享的 则存储分销的上级id
                    this.from && API_Distribution.visitMiniprogramCode({ from: this.from })
                    uni.getStorageSync(Keys.accessToken) && this.getGoodsIsCollect();
					uni.$emit('goodsback')
                    //直播
                    // #ifdef MP-WEIXIN
                    liveVideo && this.getLiveVideoRoomList()
                    // #endif
                    this.is_buy = this.goods.market_enable != 0 && this.goods.is_auth != 0
                }).catch(error => {
                    uni.redirectTo({
                        url: './goods-error'
                    })
                })
            },
            //sku变化
            handleGetAssembleDetail(sku) {
                if (this.is_assemble) {
                    /** 查询获取某个拼团的sku详情 */
                    const { sku_id } = sku
                    API_Promotions.getAssembleDetail(sku_id).then(res => { this.assemble = res })
                }
                this.selectedSku = sku
                //设置已选SKU 参与的活动
                this.promotions.forEach(res => {
                    if(res.sku_id === this.selectedSku.sku_id || res.goods_id == -1){
                        this.promotion_type = res.promotion_type
                    }
                })
                this.loading = false;
            },
            //自营商品
            selfChange(val) {
                this.self_operated = val
            },
            //分享
            handleShare() {
                this.judgeLogin(() => {
                    this.disPopupShow = true
                })
            },
            //关闭分享弹窗
            handleClose(show) {
                this.disPopupShow = show
            },
            //分销参数
            getGenerateShortLink() {
                API_Distribution.generateShortLink().then(response => {
                  const _query = response.message.substring(response.message.indexOf('?'), response.message.length)
                  this.disParams = `${_query}&goods_id=${this.goods_id}`
                })
                // #ifdef MP-WEIXIN
                API_Distribution.getMiniprogramCode(this.goods_id).then(response => {
                  let minicode = response.replace(/http\:\/\//, 'https://')
                  this.minicode = minicode
                })
                // #endif
            },
            //客服
            handleChat() {
              if (this.is_IM) {
                this.judgeLogin(() => {
                  let url = '/chat-module/chat'
                  url += `?receiver_id=${this.$refs.seller.shopInfo.shop_id}`
                  url += `&receiver_name=${encodeURIComponent(this.$refs.seller.shopInfo.shop_name)}`
                  uni.navigateTo({ url })
                })
              } else {
                const shop_qq = this.$refs.seller.shopInfo.shop_qq
                if (shop_qq) {
                  // #ifdef H5
                  const ua = navigator.userAgent.toLowerCase()
                  if(ua.match(/MicroMessenger/i)=="micromessenger") {
                    location.href="http://wpa.qq.com/msgrd?v=3&uin="+ shop_qq + "&site=qq&menu=yes"
                  } else if(ua.indexOf('baiduboxapp') > 0) {
                    this.$u.toast('由于百度浏览器限制不支持跳转到QQ')
                  } else {
                    location.href="mqq://im/chat?chat_type=wpa&uin="+ shop_qq +"&version=1&src_type=web"
                  }
                  // #endif
                  // #ifdef APP-PLUS
                  plus.runtime.openURL("mqq://im/chat?chat_type=wpa&uin="+ shop_qq + "&version=1&src_type=web");
                  // #endif
                } else {
                  this.$u.toast('该店铺未设置客服账号')
                }
              }
            },
            //跳转至购物车
            handleCart() {
                uni.switchTab({
                    url: '/pages/tabs/cart/cart'
                })
            },
            //规格弹窗显示关闭
            handleskuPopup(show) {
                this.skuPopupShow = show
            },
            //购买数量
            handleBuyNum(num) {
                this.buyNum = num
            },
            //加入购物车
            handleAddToCart() {
                //如果已下架
                if(!this.is_buy){
                    return;
                }
                this.judgeLogin(() => {
                    this.getActivityId()
                    const { sku_id } = this.selectedSku
                    const { buyNum, activity_id, promotion_type } = this
                    API_Trade.addToCart(sku_id, buyNum, activity_id, promotion_type).then(response => {
                        this.$u.toast('已加入购物车')
                        //更新购物车数量
                        this.getAllCount()
                        this.skuPopupShow = false
                    });
                })
            },
            //立即购买
            handleBuyNow() {
                //如果已下架
                if(!this.is_buy){
                    return;
                }
                this.judgeLogin(() => {
                    this.getActivityId()
                    const { sku_id } = this.selectedSku
                    const { buyNum, activity_id, promotion_type } = this
                    API_Trade.buyNow(sku_id, buyNum, activity_id, promotion_type).then(response => {
                        this.skuPopupShow = false
                        this.navigateTo(`/order-module/checkout/checkout?way=BUY_NOW`)
                    })
                })
            },
            /**
             * 拼团购买
             */
            handleAssembleBuyNow() {
                this.judgeLogin(() => {
                    const { buyNum } = this
                    const { sku_id } = this.selectedSku
                    API_Trade.addToAssembleCart(sku_id, buyNum).then(response => {
                        this.skuPopupShow = false
                        this.$u.route({
                            url: '/order-module/checkout/checkout',
                            params: {
                                from_nav: 'assemble'
                            }
                        })
                    })
                })
            },
            /**
             * 参与拼团
             * @param {Object} order  拼团订单信息
             */
            toAssembleBuyNow(order) {
                this.judgeLogin(() => {
                    const { buyNum } = this
                    const { sku_id } = this.selectedSku
                    API_Trade.addToAssembleCart(sku_id, buyNum).then(response => {
                        this.skuPopupShow = false
                        this.$u.route({
                            url: '/order-module/checkout/checkout',
                            params: {
                                from_nav: 'assemble',
                                assembleOrderId: order.order_id
                            }
                        })
                    })
                })
            },
            /** 检查是否有积分兑换、团购、限时抢购活动 */
            getActivityId() {
                const { promotions } = this;
                if (!promotions || !promotions.length) return '';
                // 把团购跟限时抢购 排序放在数组前边 先循环
                promotions.map((item,index) => {
                   if(item.promotion_type === 'GROUPBUY' || item.promotion_type === 'SECKILL'){
                      promotions.unshift(promotions.splice(index , 1)[0]);
                   }
                })
                let pro;
                for (let i = 0; i < promotions.length; i++) {
                  let item = promotions[i];
                  if ( item.promotion_type === 'SECKILL' || item.promotion_type === 'GROUPBUY' || item.promotion_type === 'EXCHANGE' || item.promotion_type === 'MINUS' || item.promotion_type === 'HALF_PRICE') {
                    // 积分兑换没有sku_id 所以直接判断   并且 如果单品立减与第二件半价 是全商品参与也没有sku_id
                    if (item.promotion_type === 'EXCHANGE'|| item.goods_id === '-1') {
                        pro = item;
                        break
                    }
                    if (this.selectedSku.sku_id === item.sku_id) {
                      pro = item;
                      break
                    }
                  }
                }
                if (!pro) return '';
                this.activity_id = pro.activity_id
                this.promotion_type = pro.promotion_type
            },
            // 获取商品收藏
            getGoodsIsCollect() {
                API_Members.getGoodsIsCollect(this.goods_id).then(response => {
                    this.collected = response.message
                })
            },
            //收藏
            handleCollect() {
                this.judgeLogin(() => {
                    if (this.collected) {
                        API_Collection.deleteGoodsCollection(this.goods_id).then(() => {
                            this.collected = false
                            uni.showToast({ title: '取消成功' })
                        })
                    } else {
                        API_Collection.collectionGoods(this.goods_id).then(() => {
                            this.collected = true
                            uni.showToast({ title: '收藏成功' })
                        })
                    }
                })
            },
            //图片预览
            handlePreviewImage(index, image) {
                const urls = []
                this.gallery_list.forEach(item => {
                    urls.push(item.image)
                })
                uni.previewImage({
                    current: index,
                    urls: urls
                })
            },

            //获取商品促销
            getGoodsPromotions() {
                API_Promotions.getGoodsPromotions(this.goods_id).then(response => {
                    this.promotions = response
                })
            },
            //获取购物车数量
            getAllCount(){
                let _allCount = 0
                API_Trade.getCarts().then(res => {
                    const { cart_list } = res
                    cart_list.forEach(shop => {
                        shop.sku_list.forEach(item => {
                            if (item.invalid !== 1) {
                                _allCount += item.num
                            }
                            this.cartGoodsCount = _allCount
                        })
                    })
                })
            },
            //获取店铺直播信息
            getLiveVideoRoomList() {
                const params = {
                  page_no: 1,
                  page_size: 10,
                  seller_id: this.goods.seller_id
                }
                API_Live.getLiveVideoRoomList(params).then(response => {
                    const { data } = response
                    if (data && data.length) {
                        this.room_id = data[0].we_chat_room_id
                        this.is_seller_liveVideo = true
                    } else {
                        this.is_seller_liveVideo = false
                    }
                    this.is_liveVideo = liveVideo
                })
            },
            //点击进入直播间
            handleLiveVideo() {
                uni.navigateTo({ url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${this.room_id}` })
            },
            onRefresh(){
                this.is_assemble = false;
            },
            // 活动结束
            handleCountEnd() {
                uni.redirectTo({
                    url: '/goods-module/goods?goods_id='+this.goods_id
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    /deep/ .goods-container {
        margin-bottom: 150rpx;
        .collection-text {
            color: #747474;
        }
        .comment-btn {
            padding: 12rpx 50rpx;
            border: 2rpx solid #A6A6A6;
            border-radius: 70rpx;
        }
        .u-divider {
            height: 80rpx !important;
        }
        .u-th, .u-td {
            padding: 20rpx 30rpx !important;
            background-color: #FFFFFF;
        }
        .u-td {
            font-size: 24rpx !important;
            color: #8E8E8E !important;
            min-height: 72rpx;
        }
        .u-tag {
            padding: 8rpx !important;
            font-size: 20rpx;
            margin-right: 2rpx;
        }
        .params-left {
            .u-td {
                color: #989898 !important;
            }
        }
    }
    //商品基本信息
    .goods-base-view {
        padding: 20rpx 30rpx 30rpx 30rpx;
        border-radius: 5px 5px 0 0;
        background-color: #FFFFFF;

        .base-price-view {
            display: flex;
            flex-direction: row;
            align-items: flex-end;
            justify-content: space-between;
        }
        .collection-icon-selected {
            color: #ff5000;
        }
        .goods-title {
            font-size: 33rpx;
            font-weight: bold;
            vertical-align: middle;
        }
    }

    //优惠券 促销
    .discounts-view {
        border-radius: 15rpx;
        margin-top: 23rpx;
        overflow: hidden;
    }

    //加粗字体
    .bold-text {
        font-weight: bold;
    }

    //商品下架删除无货等提示
    .market-enable {
        position: fixed;
        z-index: 99;
        bottom: 164rpx;
        left: 0px;
        background-color: #606266;
        padding: 10rpx;
        width: 100%;
        text-align: center;
        color: #FFFFFF;
    }

    //底部按钮
    .navigation {
        position: fixed;
        z-index: 99;
        bottom: 0px;
        left: 0px;
        display: flex;
        justify-content: space-between;
        margin-top: 100rpx;
        border: solid 2rpx #f2f2f2;
        background-color: #ffffff;
        padding: 20rpx 0;
        width: 100%;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 60rpx;

        .left-view {
            display: flex;
            font-size: 20rpx;
            .item {
                margin: 0 30rpx;
                &.car {
                    text-align: center;
                    position: relative;
                    .car-num {
                        // position: absolute;
                        top: -10rpx;
                        right: -10rpx;
                    }
                }
            }
            /deep/ {
                button {
                    background-color: #FFFFFF;
                    font-size: 20rpx;
                    line-height: 1.2;
                    &::after {
                        border: none;
                    }
                }
            }
        }
    }
    //加入购物车、立即购买按钮
    .navigation .right-view {
        font-size: 28rpx;
        color: #ffffff;
        margin: 0 20rpx;
        .btn {
            line-height: 80rpx;
            padding: 0 30rpx;
            text-align: center;
        }
        .inventory {
            filter: opacity(0.7);
            border-radius: 40rpx;
            background: linear-gradient(to right, #FFCA1E 0%, #EF0D25 100%);
        }
        .cart {
            border-top-left-radius: 40rpx;
            border-bottom-left-radius: 40rpx;
		    background: linear-gradient(145deg,#ff9000,#ff5000 77%);
        }
        .buy {
            border-top-right-radius: 40rpx;
            border-bottom-right-radius: 40rpx;
		    background: #ff9000;
        }
        .alone-buy {
            display: flex;
            flex-direction: column;
            line-height: 40rpx;
            border-top-left-radius: 40rpx;
            border-bottom-left-radius: 40rpx;
            background: linear-gradient(to right, #FFCA1E 0%, #FF8B18 100%);
        }
        .assemble-buy{
            display: flex;
            flex-direction: column;
            line-height: 40rpx;
            border-top-right-radius: 40rpx;
            border-bottom-right-radius: 40rpx;
            background: linear-gradient(to right, #FD5632 0%, #EF0D25 100%);
        }
        .disable {
            color: #FF8B18;
        }
    }
    .safe-view {
        height: 280rpx;
    }
	/deep/.u-size-mini {
		display: -webkit-inline-box;
		display: -webkit-inline-flex;
		display: inline-flex;
		width: auto;
		font-size: 12px;
		padding-top: 1px;
		height: 27px;
		line-height: 27px;
		padding: 0 11px;
		margin-bottom: 7px;
	}
    .live-video {
    	position: fixed;
    	left: 30rpx;
    	bottom: 160rpx;
    	background-color: #FF8099;
    	display: flex;
    	align-items: center;
    	justify-content: center;
    	padding: 6rpx 15rpx;
    	border-radius: 10rpx;
        color: #FFFFFF;
    }
</style>
